<template>
	<div id="app">
    <form @submit.prevent="setMessage">
      <div>
        <label for="name">姓名：</label>
        <input type="text" id="name" v-model="message.name">
      </div>
      <div>
        <label for="psd">密码：</label>
        <input type="password" id="psd" v-model="message.password">
      </div>
      <div>
        <label for="mail">邮箱：</label>
        <input type="text" id="mail" v-model="message.mail">
      </div>
      <div>
        <label for="sex">性别：</label>
        <input type="radio" value="男" id="sex" v-model="message.sex">
        <label for="sex">男</label>
        <input type="radio" value="女" id="woman" v-model="message.sex">
        <label for="woman">女</label>
      </div>
      <div>
        <label for="lq">兴趣爱好：</label>
        <input type="checkbox" value="篮球" id="lq" v-model="message.xqah">
        <label for="lq">篮球</label>
        <input type="checkbox" value="足球" id="zq" v-model="message.xqah">
        <label for="zq">足球</label>
        <input type="checkbox" value="羽毛球" id="ymq" v-model="message.xqah">
        <label for="ymq">羽毛球</label>
      </div>
      <button>注册</button>
    </form>
	</div>
</template>

<script>
export default {
  data(){
    return{
      message:{
        name:"",
        password:"",
        mail:"",
        sex:"男",
        xqah:[]
      }
    }
  },
  methods:{
    setMessage(){
      console.log(this.message);
    }
  }
};
</script>
<style>
</style>